<template>
  <div>
    <h2>门店增加</h2>
    <table class="table table-bordered"> 
      <tbody>
        <tr>
          <td>门店名称</td>
          <td><input type="text"></td>
        </tr>
        <tr>
          <td>门店地址</td>
          <td><input type="text"></td>
        </tr>
        <tr>
          <td>门店电话</td>
          <td><input type="text"></td>
        </tr>
        <tr>
          <td>门店图片</td>
          <td><input type="file" @change="changeimg">
          <img :src="state.url" alt="" width="100" height="100">
          </td>
        </tr>
        <tr>
          <td>是否启用</td>
          <td><input type="radio" name="use">是
              <input type="radio" name="use">否
          </td>
        </tr>
        <tr>
          <td></td>
          <td><input type="button" value="增加"></td>
        </tr>
      </tbody>
    </table>
  </div>
</template>

<script setup lang="ts">

import { reactive,toRefs,onMounted } from 'vue';
import axios from 'axios';
import { useRouter,useRoute } from 'vue-router'; 
const router = useRouter();
const route=useRoute();


let data:any=reactive({
  state:{
    url:'',
  }
})
let {state}=toRefs(data);

const changeimg=(e:any)=>{

  let forData= new FormData();
  let obj=e.target.files[0];
  forData.append('file',obj)

  axios({
    url:'/api/Comm/upimg',
    method:'post',
    data:forData
  }).then((res)=>{
    console.log(res);
    if(res.data.code==1002){
      alert(res.data.msg)
      return;
    }
    if(res.data.code==1001){
      alert(res.data.msg);
      return;
    }

    state.value.url='https://localhost:7242'+res.data.data;
  }).catch((err)=>{
    console.log(err);
  })

}

</script>

<style scoped>

</style>